<template>
	<!-- 广告插入 -->
	<view class="ad_warp bg-white h_100 p-3 text-center" v-if="adShow">
		<image :src="adData.img" mode="aspectFit"></image>
		<view class="mt-2">
			<view class="h3 font-weight-bold">{{adData.title || ''}}提醒您</view>
			<view class="font">即将进行页面跳转... {{time || 0}}s</view>
		</view>
		<button class="ad_btn mt-5 bg_main text-white font-lg" @click="closeAd">马上跳转</button>
	</view>
</template>

<script>
	import { advertisementSlot } from '@/api/common.js'
	export default {
		props: ['title'],
		data() {
			return {
				adData: {},
				time: 3,
				adShow: false,
			}
		},
		watch: {
			title(newV) {
				// console.log("title==", newV);
			}
		},
		mounted() {
			// 跳转时的广告插入
			let msg = {
				uid: uni.getStorageSync('userInfo').userId || 0, //用户id
				type_title: this.title
			}
			advertisementSlot(msg).then(res => {
				if (res.code == 0) {
					if (!res.data || res.data && res.data.length <= 0) {
						this.adShow = false
						this.$emit('adfun', this.adShow)
					} else {
						this.adData = res.data
						this.time = res.data.second
						this.adShow = true
						setInterval(() => {
							if (this.time >= 1) {
								this.time--
								if (this.time == 0) {
									this.adShow = false
								}
							}
						}, 1000)
						setTimeout(() => {
							// console.log("adShow", this.adShow);
							this.adShow = false
							this.$emit('adfun', this.adShow)
						}, res.data.second * 1000)
					}
				} else {
					this.adShow = false
					this.$emit('adfun', false)
				}
			}).catch(err => {
				this.adShow = false
				this.$emit('adfun', false)
			})
		},
		methods: {
			closeAd() {
				this.adShow = false
				this.$emit('adfun', false)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.ad_warp {
		padding-top: 200rpx;

		image {
			width: 100%;
			height: 220rpx;
			margin: auto;
		}

		.ad_btn {
			width: 350rpx;
			height: 90rpx;
			line-height: 90rpx;
		}
	}
</style>